<!doctype html>
 
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>jQuery UI Dialog - Modal form</title>
	<link rel="stylesheet" href="css/jquery-ui.css" />
    <!--script src="http://code.jquery.com/jquery-1.8.2.js"></script-->    
	<script src="script/jquery-1.4.4.js"></script>    
    <!--script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script-->  
	<script src="script/jquery-ui.min.js"></script>    
	
	
    <style>
        body { font-size: 62.5%; }
        label, input { display:block; }
        input.text { margin-bottom:12px; width:95%; padding: .4em; }
        fieldset { padding:0; border:0; margin-top:25px; }
        h1 { font-size: 1.2em; margin: .6em 0; }        
        .ui-dialog .ui-state-error { padding: .3em; }        
    </style>
	
    <script>
	
    $(function() {
        var username = $( "#username" ),           
            password = $( "#password" );
			
        $( "#dialog-form" ).dialog({
            autoOpen: false,
            height: 300,
            width: 350,
            modal: true,
            buttons: {
                "Login": function() {
					alert('username: ' + username.val() + ' - pass: ' + password.val());
                },
                Cancel: function() {
                    $( this ).dialog( "close" );
                }
            },
            close: function() {
                //allFields.val( "" ).removeClass( "ui-state-error" );
            }
        });
 
        $( "#create-user" )
            .button()
            .click(function() {
                $( "#dialog-form" ).dialog( "open" );
            });
    });
    </script>
</head>

<body>
 
<div id="dialog-form" title="Login"> 
    <form>
    <fieldset>
        <label for="name">Userame</label>
        <input type="text" name="username" id="username" class="text ui-widget-content ui-corner-all" />    
        <label for="password">Password</label>
        <input type="password" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" />
    </fieldset>
    </form>
</div>
<button id="create-user">Create new user</button>
 
 
</body>
</html>